import axios from 'axios'
import React from 'react'
import './index.css'
import { NavLink } from 'react-router-dom'

export default function Recommend() {

const [lists,setLists]=React.useState([])
  React.useEffect(()=>{
    axios.get(`http://localhost:3000/getSongLists?categoryId=10000000`).then(
      response=>{
        // console.log(response.data.response.data.list);获取到推荐歌单
        setLists(response.data.response.data.list)
      },
      error=>{
        console.log('失败',error)
      }
    )
    return ()=>{ 
    }
},[])
const a=lists.map((l)=>{
  return (<NavLink to="/songlist"
  state={{
    dissid:l.dissid
  }}
    className='CDlistitem' key={l.dissid} 
  >
    <img src={l.imgurl} width='200px' height='200px' />
    {l.dissname}
  </NavLink>)

})

  return (
    <div className='CDitem'>
      <span className='CDlist-title'>热门推荐</span> 
      <ul className='CDlist'>
        {a}
      </ul>
    </div>
  )
}
